/**
 *
 */
Ext.define('vacake.view.Product', {
    extend: 'Ext.Panel',
    xtype: 'product',
    requires: [
            'Ext.field.*',
            'Ext.Label'
    ],
    config: {
        layout: {
            type: 'vbox',
            align: 'stretch'
        },
        scrollable: {
            direction: 'vertical',
            directionLock: true
        },
        items: [{
                xtype: 'toolbar',
                docked: 'top',
                id: 'toolbar',
                items: [{
                        text: '返回',
                        action: 'back_button',
                        ui: 'action-back'
                    }
                ]
            }, {
                xtype: 'carousel',
                direction: "horizontal",
                height: '200px',
                id: 'productCarousel'
            }, {
                xtype: 'fieldset',
                id: 'productBase',
                cls: 'x-area color2',
                items: [{
                        xtype: 'panel',
                        layout: 'hbox',
 
                        cls:'height30 color2',
                        items: [
                            {
                                xtype: 'label',
                                cls:'font5',
                                labelWidth:'90px',
                                html: '综合评分：'
                            }, {
                                xtype: 'label',
                                cls:'font3',
                                id: 'showProductGrade',
                                width: '50%',
                                html: ''
                            }, {
                                xtype: 'button',
                                cls:'x-button5  noheart',
                                style:'height:40px; width:40px; margin:0px;  position: absolute; right:-5px;top:-10px',
                                id: 'productCollect'
                            }
                        ]
                    }, {
                        xtype: 'panel',
                        layout: 'hbox',
                        cls:'height30 color2',
                        items: [
                            {
                                xtype: 'label',
                                cls:'font5',
                                labelWidth:'90px',
                                html: '产品名称：'
                            }, {
                                xtype: 'label',
                                cls:'font3',
                                id: 'showProductName',
                                html: ''
                            }
                        ]
                    }, {
                    xtype: 'panel',
                    layout: 'hbox',
                    cls: 'height30 color2',
                    items: [
                        {
                            xtype: 'label',
                            cls: 'font5',
                            labelWidth: '90px',
                            html: '<span style="letter-spacing:6px;">浏览量</span>：'
                        },
                        {
                            xtype: 'label',
                            cls: 'font3',
                            id: 'showProductView',
                            html: ''
                        }
                    ]
                },
                    {
                        xtype: 'panel',
                        layout: 'hbox',
                        cls: 'height30 color2',
                        items: [
                            {
                                xtype: 'label',
                                cls: 'font5',
                                labelWidth: '90px',
                                html: '<span style="letter-spacing:6px;">销售量</span>：'
                            },
                            {
                                xtype: 'label',
                                cls: 'font3',
                                id: 'showProductMark',
                                html: ''
                            }
                        ]
                    }, {
                        xtype: 'panel',
                        layout: 'hbox',
                        style:'line-height:30px;',
                        items: [{
                                xtype: 'label',
                                cls:'color2 font5',
                                labelWidth:'90px',
                                html: '产品介绍：'
                            }, {
                                xtype: 'label',
                                style:'width:70%',
                                cls: ' color3 font3',
                                id: 'showProductExplain',
                                html: ''
                            }
                        ]
                    }, {
                        xtype: 'label',
                        hidden: true,
                        id: 'showProductIsOrder',
                        html: '本产品需要提前24小时预约'
                    }, {
                        xtype: 'hiddenfield',
                        id: 'showProductId'
                    }
                ]
            }, {
                xtype: 'fieldset',
                cls: 'x-area',
                items: [ 
                    {
                        html:'商品规格：',
                        width:'50%',
                        cls:'height30 color2 font5'
                    }, {
                        cls:'x-container2',
                        id: 'productStandard',
                        style:'margin:0 0 10px 0px'
                    },
                    {
                        xtype: 'spinnerfield',
                        name: 'numbers',
                        cls:'x-container3',
                        id: 'numbers',
                        minValue: 1,
                        groupButtons: false,
                        stepValue: 1,
                        labelWidth: '90px',
                        width: '250px',
                        label: '数&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;量：'
                    },
                    {
                        xtype: 'panel',
                        id:'viewProductPrice',
                        hidden:true,
                        layout: 'hbox',
                        style: 'line-height:30px;margin-left: 3px;',
                        items: [
                            {
                                xtype: 'label',
                                cls: 'color2 font5',
                                style: 'padding-top: 7px;',
                                labelWidth: '90px',
                                html: '原&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;价：'
                            },
                            {
                                xtype: 'label',
                                style: 'width:70%;padding-left: 7px;padding-top: 8px;',
                                cls: ' color3 font6',
                                id: 'showProductPrice',
                                html: ''
                            }
                        ]
                    } , {
                        xtype: 'textfield',
                        name: 'countPrice',
                        cls:' readOnly x-container4',
                        id: 'countPrice',
                        labelWidth: '90px',
                        value: '￥',
                        label: '总&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;价：',
                        readOnly: true
                    }, {
                        xtype: 'panel',
                        layout: {
                            type: 'hbox',
                            align: 'middle',
                            pack: 'center'
                        },
                        items: [{
                                xtype: 'button',
                                text: '购买',
                                id: 'sellProduct',
                                ui: 'confirm',
                                width: '47%'

                            }, {
                                xtype: 'button',
                                //iconCls:'cart',
                                text: '加入购物车',
                                id: 'addCars',
                                ui: 'confirm',
                                width: '47%'

                            }
                        ]
                    }
                ]
            }, {
                cls: 'fenge',
                margin: '6px 0'
            }, {
                xtype: 'panel',
                style: 'margin:6px;',
                layout: 'vbox', 
                items: [{
                        xtype: 'label',
                        cls: 'height30 font2 color2 center',
                        html: '用户口碑'
                    }, {
                        xtype: 'list',
                        id:'praiseList',
                        store: 'ProductAssess',
                        emptyText: '<div style="webkit-border-radius: 8px;border-radius: 8px;margin: 6px 0; height: 90px;" class="shoppingEdit_bg shadow font2 color2 height30">此产品暂时没有评论</div>',
                        scrollable: false,
                        height: '100px',
                        itemTpl: "<div style=';webkit-border-radius: 8px;border-radius: 8px; position: relative;'>"
                         + "<div style='position: absolute; right: 10px; top: 5px; color:#ec6d00'>有用({supportnum})</div>" 
                         + "<div class='font2 color2 height30 '>"
                         + "<span>评&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;分：</span>" 
                         + "<img src='resources/images/product_grade_{grade}.png'  class='img97'>"
                         + "</div>" + "<div class='font2 color2 height30'>" 
                         + "<span>用&nbsp;户&nbsp;名：</span>{cuname}" 
                         + "</div>" 
                         + "<div class='font2 color2 height30'>" 
                         + "<span>评&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;价：</span>" 
                         + "<span class='font3 color3'>{messages}<span>" + "</div>" + "</div>"
                    }
                ]
            }
        ], listeners: {
            back: function () {
                var backid = Ext.Viewport.getInnerItems().length - 2;
                Ext.Viewport.remove(Ext.Viewport.getActiveItem(), true);
                Ext.Viewport.setActiveItem(backid);
            }
        }

    }

});